<!DOCTYPE html>
<html>

	<head>
		<!-- 声明文档使用的字符编码 -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<!-- 为移动设备添加 viewport -->
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
		<meta name="HandheldFriendly" content="true">
		<!-- 优先使用 IE 最新版本和 Chrome -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<title>店员登录</title>
		<script type="text/javascript" src="/js/setFontSize.js"></script>
		<link rel="stylesheet" href="/css/swiper.min.css" />
		<link rel="stylesheet" href="/css/main.css" />
	</head>

	<body>
		<main>
			<div id="app">
				<section class="login">
					<div class="box">
						<div class="title">
							<h3 class="name">店员端</h3>
							<div class="enName">Shop assistant</div>
						</div>
						<form class="loginForm" action="index.html" method="get">
							<label class="formItem">
								<div class="name">账号</div>
								<div class="inputBox">
									<input type="text" class="formInput" name="user" v-model="managerName"/>
									<div class="icon icon1"></div>
								</div>
							</label>
							<label class="formItem">
								<div class="name">密码</div>
								<div class="inputBox">
									<input type="password" class="formInput" name="pwd" v-model="password"/>
									<div class="icon icon2"></div>
								</div>
							</label>
							<button type="button" class="subBtn" @click="login">登录</button>
						</form>
						<div style="margin-top: 10px;float: left">
							<a href="index.html" >忘记密码？</a>
						</div>
						<div style="margin-top: 10px;float: right">
							<a href="/managerclient/join.html" >还没有账号？点击注册</a>
						</div>
					</div>
				</section>
			</div>
		</main>

		<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="../js/swiper.min.js"></script>
		<script type="text/javascript" src="../js/layer/layer.js" ></script>
		<script type="text/javascript" src="../js/main.js"></script>
		<script type="text/javascript" src="/js/vue.js"></script>
		<script type="text/javascript" src="/js/axios.js"></script>
	</body>
<script>
	const app = new Vue({
		el:"#app",
		data:{
				managerName:"",
				password:""
		},
		methods:{
			login(){
				axios.post("/manage/login",{
						managerName:app.managerName,
						password:app.password
				}).then(function (res) {
					if (res.data==="登陆成功!"){
						location.href="index.html";
					}else{
						layer.msg(res.data)
					}
				})
			}
		}
	})
</script>

</html>